<template>
	<view class="flex flex-direction">
		<view v-if="isShowAddess" class="noAdd flex align-center justify-between" @tap="toAddAddress">
			<text>暂无收货地址</text>
			<view>
				<text>现在去添加</text>
				<text class="lg text-gray cuIcon-right" @tap="toAddAddress"></text>
			</view>
		</view>
		<view class="add flex flex-direction" @tap='toAddress' v-if="defaultAddress.name">
			<view class="add-top flex align-center justify-between">
				<view class="flex align-center">
					<!--view>默认</view-->
					<text>收货人：{{defaultAddress.name}}</text>
				</view>
				<text>{{defaultAddress.mobile}}</text>
			</view>
			<view class="add-btn flex align-center">
				<image src="/static/b15.png"></image>
				<text>{{defaultAddress.area}} {{defaultAddress.address}}</text>
			</view>
			<text class="lg text-gray cuIcon-right" @tap='toAddress'></text>
		</view>
		<image mode="widthFix" style="width: 100%;" src="/static/b14.png"></image>
		<view class="top flex align-center">
			<text>商品信息</text>
		</view>
		<view class="list">
			<block v-for="(item, index) in postOrderShow.dygoodslist">
				<view class="item flex align-center justify-between">
					<image :src="item.img_url"></image>
					<view class="flex flex-direction">
						<text>{{item.title}}</text>
						<text>规格：{{item.goods_guige}}</text>
					</view>
					<view class="flex flex-direction">
						<text class="text-price">{{item.sell_price}} </text>
						<text>×{{item.quantity}}</text>
					</view>
				</view>
			</block>
		</view>
		<!-- <view class="li align-center justify-between flex">
			<text>累计满减金额</text>
			<text class="text1">￥0</text>
		</view>
		<view class="li align-center justify-between flex">
			<text>累计满减金额</text>
			<view class="flex flex-direction">
				<text class="text2">-￥0</text>
				<text class="text3">享全场满减活动，满1000减100</text>
			</view>
		</view> -->
		<view class="li align-center justify-between flex">
			<text>快递运费</text>
			<view class="flex flex-direction">
				<text class="text1">{{postOrderShow.express_fee}}</text>
				<text class="text3">享全场包邮活动</text>
			</view>
		</view>
		<view class="li align-center justify-between flex">
			<text>订单合计</text>
			<text class="text2">￥{{postOrderShow.order_amount}}</text>
		</view>
		<view style="margin-top: 20upx;" class="li align-center justify-between flex">
			<text>是否需要发票</text>
			<!-- <switch></switch> -->
			<switch class="section-right" :checked="isSwitch" @change="switchChange" />
		</view>
		<view class="li align-center justify-between flex">
			<text>发票抬头</text>
			<view class="flex align-center">
				<text>{{invoice}}</text>
				<text style="margin-left: 20upx;" class="lg text-gray cuIcon-right" @tap="toSwichTitle"></text>
			</view>
		</view>
		<view class="li align-center justify-between flex">
			<text>抬头信息</text>
			<input placeholder="请输入..." v-model="invoiceTitle"/>
		</view>
		<view style="height: 120upx;"></view>
		<view class="bottom flex align-center justify-between">
			<view class="flex flex-direction">
				<text style="text-align: left;" class="text3">共{{postOrderShow.dygoodslist.length}}件商品</text>
				<view class="flex align-center">
					<text class="">合计</text>
					<text class="text2 text-price">{{postOrderShow.order_amount}}</text>
				</view>
			</view>
			<view @tap='savePostOrder'>提交订单</view>
		</view>
	</view>
</template>

<script>
	var api = require('@/components/api.js');
	export default {
		data() {
			return {
				user: '',
				cartNum: 0,
				goods_id: '',
				postOrderShow: [],
				defaultAddress:{name:'',mobile:'',area:'',address:''},
				isInvoice:1,
				invoice:'个人',
				invoiceTitle:'',
				isSwitch:false,
				isShowAddess:false,

			}
		},
		onShow() {
			console.info('confirmOrder loadGetAddress')
			this.loadLocalAddress()
			this.loadGetAddress()
			
		},
		onLoad(opt) {
			this.loadUser()
			console.log(JSON.stringify(opt))
			if (opt.key) {
				this.postOrderShow = JSON.parse(opt.key)
				if(this.postOrderShow.dyaddressList.length>0){
				  this.defaultAddress = this.postOrderShow.dyaddressList[0]	
				}else{
					this.isShowAddess = true
					console.log('onLoad:'+this.isShowAddess)
				}
			} 
		},
		methods: {
			loadGetAddress:function(){
				api.get({
					url:'User/GetAddress',
					data:{user_id:this.user.user_id},
					success:data=>{
						console.info('loadGetAddress'+JSON.stringify(data))
						this.defaultAddress = {}
						if(data.ErrCode==0){
							var addressList = data.Response
							for(var i=0;i<addressList.length;i++){
								if(addressList[i].is_default==2){
									this.defaultAddress = addressList[i]
									this.isShowAddess = false
									break
								}
							}
						}else{
							this.isShowAddess = true
						}
					}
				});
			},
			loadUser: function() {
				try {
					this.user = uni.getStorageSync('user');
					console.log(this.user);
				} catch (e) {}
			},
			loadPostOrderShow: function() {
				api.post({
					url: 'Order/PostOrderShow?user_id=' + this.user.user_id,
					data: {
						data: [{
							cart_id: 0,
							goods_id: 27,
							goods_type: 1,
							quantity: 1,
							sku_id: 0,
						}],

					},
					success: data => {
						console.log(JSON.stringify(data));
						if (data.ErrCode == 0) {
							this.postOrderShow = data.Response
						}
					}
				});
			},
			loadLocalAddress:function(){
				if(uni.getStorageSync('isAddress')){
					this.isShowAddess = false
					this.defaultAddress = uni.getStorageSync('address')
				}
			},
			savePostOrder: function() {
				if(this.isInvoice == 2){
					if(this.invoiceTitle == ''){
						uni.showToast({
							title:'请输入发票抬头'
						})
						return;
					}
				}
				var dataTemp = []
				console.log('confirmOrder savePostOrder' + JSON.stringify(this.postOrderShow))
				for (var i = 0; i < this.postOrderShow.dygoodslist.length; i++) {
					var temp = {} //{cart_id:0,goods_id:'',goods_img_url:'',price:0.0,ratio_price:0.0,totle_price:0.0,goods_type:1,quantity:0,sku_id:''} 
					temp.cart_id = this.postOrderShow.dygoodslist[i].cart_id
					temp.goods_id = this.postOrderShow.dygoodslist[i].goods_id
					temp.goods_img_url = this.postOrderShow.dygoodslist[i].img_url
					temp.price = this.postOrderShow.dygoodslist[i].price
					temp.ratio_price = this.postOrderShow.dygoodslist[i].price
					temp.totle_price = this.postOrderShow.dygoodslist[i].price
					temp.goods_type = this.postOrderShow.dygoodslist[i].goods_type
					temp.quantity = this.postOrderShow.dygoodslist[i].quantity
					temp.sku_id = this.postOrderShow.dygoodslist[i].sku_id
					dataTemp[i] = temp
				}
				api.post({
					url: 'Order/PostOrderSave?user_id=' + this.user.user_id +
						'&order_type=1&message=&point_pay=0&is_invoice='+this.isInvoice+'&invoice_title= ',
					data: {
						data: dataTemp,
					},
					success: data => {
						console.log(JSON.stringify(data));
						if (data.ErrCode == 0) {
							uni.setStorageSync('isAddress',false)
							uni.navigateTo({
								url: '/pages/paymentOrder/paymentOrder?key=' + JSON.stringify(data.Response)
							})
						}
					}
				});
			},
			toAddAddress() {
				uni.navigateTo({
					url: '/pages/addAddress/addAddress?backurl=/pages/confirmOrder/confirmOrder/'
				})
			},
			toAddress() {
				uni.navigateTo({
					url: "/pages/receivingAddress/receivingAddress?from=buy"
				})
			},
			toSwichTitle(){
				if(this.invoice == '个人'){
					this.invoice = '公司'
				}else{
					this.invoice = '个人'
				}
				
			},
			switchChange:function(e) {
				let value = e.target.value
				if(value){
					this.isInvoice = 2
				}else{
					this.isInvoice = 1
				}
				console.log(this.isInvoice )
				console.log(value)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.li>input {
		width: 470upx
	}

	.bottom>view:nth-child(2) {
		width: 200upx;
		height: 64upx;
		background-color: $btn-bground;
		border-radius: 32upx;
		text-align: center;
		line-height: 64upx;
		color: #fff;
		font-size: 30upx;


	}

	.bottom {
		padding: 0 20upx;
		box-sizing: border-box;
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 100upx;
		background-color: #fff;
	}

	.text3 {
		font-size: 22upx;
		color: #999999;
		text-align: right;
	}

	.text1 {
		font-size: 28upx;
		color: #000000;
		text-align: right;
	}

	.text2 {
		font-size: 28upx;
		color: #f70000;
		text-align: right;
	}

	.li {
		background-color: #fff;
		width: 100%;
		height: 86upx;
		border-bottom: 1upx solid #ddd;
		padding: 0 20upx;
		box-sizing: border-box;
	}

	.item>view:nth-child(3)>text {
		text-align: right;
		font-size: 24upx;
		color: #000000;
	}

	.item>view:nth-child(3)>text:nth-child(2) {
		color: #999999;
	}

	.item>view:nth-child(2) {
		width: 382upx;
	}

	.item>view:nth-child(2)>text:nth-child(1) {
		font-size: 28upx;
		color: #000000;
	}

	.item>view:nth-child(2)>text:nth-child(2) {
		font-size: 22upx;
		color: #999999;
		margin-top: 20upx;
	}

	.item {
		padding: 0 20upx;
		width: 100%;
		height: 190upx;
		background-color: #fff;
		border-bottom: 1upx solid #ddd;
	}

	.item image {
		width: 187upx;
		height: 141upx;
	}

	.add>text {
		position: absolute;
		right: 20upx;
		top: 70upx;
	}

	.add-btn {
		margin-top: 30upx;
	}

	.add-btn image {
		width: 24upx;
		height: 32upx;
	}

	.add-btn>text {
		font-size: 26upx;
		color: #000000;
		margin-left: 20upx;

	}

	.add-top {
		padding-left: 48upx;
		box-sizing: border-box;
		width: 630upx;
	}

	.add-top>text {
		font-size: 26upx;
		color: #000000;
	}

	.add-top>view>text {
		font-size: 28upx;
		color: #000000;
		margin-left: 14upx;
		font-weight: 500;
	}

	.add-top>view>view {
		width: 63upx;
		height: 34upx;
		background-color: $btn-bground;
		border-radius: 4upx;
		text-align: center;
		line-height: 34upx;
		color: #fff;
		font-size: 22upx;
	}

	.add {
		position: relative;
		width: 100%;
		background-color: #fff;
		padding: 30upx 20upx;
		box-sizing: border-box;
	}

	.noAdd>view>text {
		font-size: 26upx;
		color: #666666;
		margin-left: 10upx;
	}

	.noAdd {
		padding: 0 20upx;
		width: 100%;
		height: 100upx;
		background-color: #ffffff;
	}

	.noAdd>text {
		font-size: 28upx;
	}

	.top {
		margin-top: 20upx;
		width: 100%;
		height: 86upx;
		padding-left: 20upx;
		border-bottom: 1upx solid #ddd;
		background-color: #ffffff;
	}
</style>
